import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';

/// 待办列表筛选操作区域组件
class TodoFilterActionsWidget extends StatelessWidget {
  final String? selectedFilter; // 'all', 'uncategorized', 'favorite'
  final bool showCompleted; // 是否显示已完成
  final Function(String?) onFilterChanged;
  final Function(bool) onShowCompletedChanged;

  const TodoFilterActionsWidget({
    super.key,
    this.selectedFilter,
    required this.showCompleted,
    required this.onFilterChanged,
    required this.onShowCompletedChanged,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: const EdgeInsets.fromLTRB(8, 12, 8, 4),
      padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 6),
      decoration: BoxDecoration(
        color: const Color(0xFFEEEEEE),
        borderRadius: BorderRadius.circular(12),
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: [
          // 全部待办 - 使用 category.svg
          _buildFilterButton(
            svgIcon: 'assets/icons/category.svg',
            tooltip: '全部待办',
            isSelected: selectedFilter == null || selectedFilter == 'all',
            onPressed: () => onFilterChanged(null),
          ),
          // 未分类待办 - 使用 not_category.svg
          _buildFilterButton(
            svgIcon: 'assets/icons/not_category.svg',
            tooltip: '未分类待办',
            isSelected: selectedFilter == 'uncategorized',
            onPressed: () => onFilterChanged('uncategorized'),
          ),
          // 已完成待办 - 切换显示/隐藏已完成项
          _buildFilterButton(
            icon: Icons.check_circle_outline,
            tooltip: showCompleted ? '隐藏已完成' : '显示已完成',
            isSelected: showCompleted,
            onPressed: () => onShowCompletedChanged(!showCompleted),
          ),
          // 关注筛选
          _buildFilterButton(
            icon: Icons.favorite_border,
            tooltip: '我的关注',
            isSelected: selectedFilter == 'favorite',
            onPressed: () => onFilterChanged(
              selectedFilter == 'favorite' ? null : 'favorite',
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildFilterButton({
    IconData? icon,
    String? svgIcon,
    required String tooltip,
    required bool isSelected,
    required VoidCallback onPressed,
  }) {
    return Tooltip(
      message: tooltip,
      child: IconButton(
        icon: svgIcon != null
            ? SvgPicture.asset(
                svgIcon,
                width: 18,
                height: 18,
                colorFilter: ColorFilter.mode(
                  isSelected ? Colors.blue : Colors.grey[700]!,
                  BlendMode.srcIn,
                ),
              )
            : Icon(
                icon!,
                size: 18,
                color: isSelected ? Colors.blue : Colors.grey[700],
              ),
        onPressed: onPressed,
        splashRadius: 20,
        constraints: const BoxConstraints(
          minWidth: 36,
          minHeight: 36,
        ),
        padding: EdgeInsets.zero,
        style: IconButton.styleFrom(
          backgroundColor: isSelected ? Colors.blue.withValues(alpha: 0.1) : Colors.transparent,
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(8),
          ),
        ),
      ),
    );
  }
}
